<template>
    <div>
        <el-form-item label="任务名称" prop="brandads_name" :rules="{required: true, message: '请输入任务名称', trigger: ['blur', 'change']}">
            <el-input v-model="addForm.brandads_name" placeholder="请输入任务名称"></el-input>
        </el-form-item>
        <el-form-item label="金额" prop="brandads_amount" :rules="addRules.checkFloat">
            <el-input v-model="addForm.brandads_amount" placeholder="请输入金额"></el-input>
        </el-form-item>
        <el-row :gutter="12">
            <el-col :span="12">
                <el-form-item label="上游收入比例" prop="upstream_ratio" :rules="addRules.checkFloat">
                    <el-input v-model="addForm.upstream_ratio" placeholder="请输入上游收入比例">
                        <i slot="suffix" style="font-style:normal;color:#17233D;margin-right:5px">%</i>
                    </el-input>
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="吐点比例" prop="spit_ratio" :rules="addRules.checkFloat">
                    <el-input v-model="addForm.spit_ratio" placeholder="请输入吐点比例">
                        <i slot="suffix" style="font-style:normal;color:#17233D;margin-right:5px">%</i>
                    </el-input>
                </el-form-item>
            </el-col>
        </el-row>
        <el-form-item label="上线日期" prop="push_date" :rules="{required: true, message: '请选择上线日期', trigger: ['blur', 'change']}">
            <el-date-picker style="width:100%" value-format="yyyy-MM-dd" v-model="addForm.push_date" type="date" placeholder="选择日期">
            </el-date-picker>
        </el-form-item>
        <div class="flexbox flexcenter font_14 color_02" style="margin-top:20px">实际收入金额：<span class="text_style">￥{{this.getAwemeMoney}}</span></div>
    </div>
</template>

<script>
export default {
    props:["addForm","addRules"],
    name: "",
    data() {
        return {
            
        };
    },
    computed: {
        getAwemeMoney() {
            return (
                this.addForm.brandads_amount *
                ((this.addForm.upstream_ratio - this.addForm.spit_ratio) / 100)
            );
        },
    },
    methods: {
        
    },
    components: {},
};
</script>


<style scoped>
.el-form-item {
    margin-bottom: 10px;
}
.text_style {
    font-size: 18px;
    color: #17233d;
}
</style>
